import GameConfig from '../config/GameConfig.js';
import Canvas from '../utils/Canvas.js';
import Animation from '../utils/Animation.js';

/**
 * 分数面板类
 */
export default class ScorePanel {
    /**
     * 初始化分数面板
     * @param {CanvasRenderingContext2D} ctx - Canvas上下文
     */
    constructor(ctx) {
        this.ctx = ctx;
        this.score = 0;
        this.highScore = parseInt(localStorage.getItem('snakeHighScore')) || 0;
        this.animations = [];
    }

    /**
     * 绘制分数面板
     */
    draw() {
      const { SCORE_PANEL } = GameConfig.LAYOUT;
      const { COLORS } = GameConfig;
      
      this.ctx.save();
      
      // 计算面板位置和尺寸
      const panelY = SCORE_PANEL.TOP_MARGIN;
      const panelHeight = SCORE_PANEL.HEIGHT;
      const padding = SCORE_PANEL.PADDING;
      
      // 绘制主面板背景
      const gradient = this.ctx.createLinearGradient(0, panelY, 0, panelY + panelHeight);
      gradient.addColorStop(0, COLORS.SCORE_PANEL.BACKGROUND_TOP);
      gradient.addColorStop(1, COLORS.SCORE_PANEL.BACKGROUND_BOTTOM);
      
      // 绘制面板主体
      this.ctx.fillStyle = gradient;
      Canvas.roundRect(
          this.ctx,
          padding,
          panelY,
          this.ctx.canvas.width - padding * 2,
          panelHeight,
          10
      );
      this.ctx.fill();
      
      // 添加面板边框渐变
      const borderGradient = this.ctx.createLinearGradient(0, panelY, 0, panelY + panelHeight);
      borderGradient.addColorStop(0, 'rgba(255, 255, 255, 0.1)');
      borderGradient.addColorStop(1, 'rgba(255, 255, 255, 0.05)');
      this.ctx.strokeStyle = borderGradient;
      this.ctx.lineWidth = 1;
      this.ctx.stroke();
  
      // 分隔线
      const centerX = this.ctx.canvas.width / 2;
      this.ctx.beginPath();
      this.ctx.moveTo(centerX, panelY + 8);
      this.ctx.lineTo(centerX, panelY + panelHeight - 8);
      this.ctx.strokeStyle = 'rgba(255, 255, 255, 0.1)';
      this.ctx.stroke();
  
      // 绘制分数
      this.drawScoreSection(
          '当前分数', 
          this.score, 
          padding + 30, // 增加左边距
          panelY + panelHeight/2, 
          'left'
      );
      
      this.drawScoreSection(
          '最高分数', 
          this.highScore, 
          this.ctx.canvas.width - padding - 30, // 增加右边距
          panelY + panelHeight/2, 
          'right'
      );
  
      // 绘制动画效果
      this.drawAnimations();
      
      this.ctx.restore();
  }
    
  /**
   * 绘制分数部分
   */
  drawScoreSection(label, score, x, y, align) {
    this.ctx.textAlign = align;
    
    // 绘制标签
    this.ctx.font = '14px "Microsoft YaHei"'; // 使用微软雅黑字体
    this.ctx.fillStyle = 'rgba(255, 255, 255, 0.7)';
    this.ctx.fillText(label, x, y - 8);

    // 绘制分数
    this.ctx.font = 'bold 22px "Microsoft YaHei"'; // 增大分数字体
    
    // 创建分数文本的渐变色
    let gradient;
    if (score > 0) {
        gradient = this.ctx.createLinearGradient(x - 40, y, x + 40, y);
        gradient.addColorStop(0, '#4CAF50');  // 绿色
        gradient.addColorStop(0.5, '#81C784'); // 浅绿色
        gradient.addColorStop(1, '#4CAF50');  // 绿色
    } else {
        gradient = '#4CAF50'; // 默认绿色
    }
    this.ctx.fillStyle = gradient;

    // 添加文本阴影
    this.ctx.shadowColor = 'rgba(0, 0, 0, 0.3)';
    this.ctx.shadowBlur = 4;
    this.ctx.shadowOffsetY = 2;

    // 绘制分数文本
    this.ctx.fillText(score.toString(), x, y + 12);

    // 如果是最高分，添加图标
    if (score === this.highScore && score > 0) {
        this.drawHighScoreIcon(x, y);
    }
}


    /**
     * 添加分数
     * @param {number} points - 增加的分数
     */
    addScore(points) {
      this.score += points;
      this.createScoreAnimation(points);
      
      // 检查是否达到新的最高分
      if (this.score > this.highScore) {
          const oldHighScore = this.highScore;
          this.highScore = this.score;
          this.createHighScoreAnimation(this.score - oldHighScore);
      }
    }

    /**
     * 创建分数增加动画
     */
    createScoreAnimation(points) {
      const animation = {
          text: `+${points}`,
          x: 100,
          y: 60, // 调整起始位置
          alpha: 1,
          scale: 1.5,
          update: () => {
              animation.y -= 0.8;
              animation.alpha -= 0.02;
              animation.scale *= 0.98;
              return animation.alpha > 0;
          }
      };
      this.animations.push(animation);
    }


    /**
     * 绘制动画效果
     */
    drawAnimations() {
      this.animations = this.animations.filter(animation => {
          if (animation.update()) {
              this.ctx.save();
              this.ctx.globalAlpha = animation.alpha;
              this.ctx.font = `bold ${24 * animation.scale}px "Microsoft YaHei"`;
              
              // 创建渐变色
              const gradient = this.ctx.createLinearGradient(
                  animation.x - 30, 
                  animation.y, 
                  animation.x + 30, 
                  animation.y
              );
              gradient.addColorStop(0, '#4CAF50');
              gradient.addColorStop(0.5, '#81C784');
              gradient.addColorStop(1, '#4CAF50');
              
              this.ctx.fillStyle = gradient;
              this.ctx.textAlign = 'center';
              this.ctx.shadowColor = 'rgba(0, 0, 0, 0.3)';
              this.ctx.shadowBlur = 4;
              this.ctx.fillText(animation.text, animation.x, animation.y);
              this.ctx.restore();
              return true;
          }
          return false;
      });
  }


    /**
     * 绘制最高分图标
     */
    drawHighScoreIcon(x, y) {
      const iconSize = 16;
      const iconX = x + (this.ctx.textAlign === 'left' ? -25 : 25);
      
      this.ctx.save();
      
      // 绘制星星图标
      this.ctx.beginPath();
      this.ctx.fillStyle = '#FFD700';
      this.ctx.shadowColor = 'rgba(255, 215, 0, 0.5)';
      this.ctx.shadowBlur = 10;
      
      // 简单的星星形状
      for (let i = 0; i < 5; i++) {
          const angle = (i * 2 * Math.PI / 5) - Math.PI / 2;
          const x1 = iconX + Math.cos(angle) * iconSize/2;
          const y1 = y + Math.sin(angle) * iconSize/2;
          if (i === 0) {
              this.ctx.moveTo(x1, y1);
          } else {
              this.ctx.lineTo(x1, y1);
          }
      }
      
      this.ctx.closePath();
      this.ctx.fill();
      
      this.ctx.restore();
    }
    /**
     * 创建最高分动画
     * @param {number} difference - 超过原最高分的分数
     */
    createHighScoreAnimation(difference) {
      const animation = {
          text: '新纪录!',
          subText: `+${difference}`,
          x: this.ctx.canvas.width - 100,
          y: 40,
          alpha: 1,
          scale: 1.5,
          update: () => {
              animation.y -= 0.3;
              animation.alpha -= 0.01;
              animation.scale *= 0.99;
              return animation.alpha > 0;
          }
      };
      this.animations.push(animation);

      // 添加星星粒子效果
      for (let i = 0; i < 20; i++) {
          this.createStarParticle(
              this.ctx.canvas.width - 100,
              40
          );
      }
    }
    /**
 * 创建星星粒子
 */
createStarParticle(x, y) {
  const angle = Math.random() * Math.PI * 2;
  const speed = Math.random() * 4 + 2;
  const particle = {
      x: x,
      y: y,
      vx: Math.cos(angle) * speed,
      vy: Math.sin(angle) * speed,
      size: Math.random() * 3 + 1,
      alpha: 1,
      update: () => {
          particle.x += particle.vx;
          particle.y += particle.vy;
          particle.vy += 0.1; // 重力效果
          particle.alpha -= 0.02;
          return particle.alpha > 0;
      }
  };
  this.animations.push(particle);
}

/**
* 绘制动画效果
*/
drawAnimations() {
  this.animations = this.animations.filter(animation => {
      if (animation.update()) {
          this.ctx.save();
          this.ctx.globalAlpha = animation.alpha;

          if (animation.text) {
              // 绘制文本动画
              if (animation.text === '新纪录!') {
                  // 绘制新纪录动画
                  this.ctx.font = `bold ${24 * animation.scale}px "Microsoft YaHei"`;
                  
                  // 创建渐变色
                  const gradient = this.ctx.createLinearGradient(
                      animation.x - 50, 
                      animation.y, 
                      animation.x + 50, 
                      animation.y
                  );
                  gradient.addColorStop(0, '#FFD700');
                  gradient.addColorStop(0.5, '#FFA500');
                  gradient.addColorStop(1, '#FFD700');
                  
                  this.ctx.fillStyle = gradient;
                  this.ctx.textAlign = 'center';
                  this.ctx.shadowColor = 'rgba(0, 0, 0, 0.3)';
                  this.ctx.shadowBlur = 4;
                  this.ctx.fillText(animation.text, animation.x, animation.y);

                  // 绘制分数差值
                  this.ctx.font = `${16 * animation.scale}px "Microsoft YaHei"`;
                  this.ctx.fillStyle = '#FFD700';
                  this.ctx.fillText(animation.subText, animation.x, animation.y + 20);
              } else {
                  // 普通得分动画
                  this.ctx.font = `bold ${24 * animation.scale}px "Microsoft YaHei"`;
                  const gradient = this.ctx.createLinearGradient(
                      animation.x - 30, 
                      animation.y, 
                      animation.x + 30, 
                      animation.y
                  );
                  gradient.addColorStop(0, '#4CAF50');
                  gradient.addColorStop(0.5, '#81C784');
                  gradient.addColorStop(1, '#4CAF50');
                  
                  this.ctx.fillStyle = gradient;
                  this.ctx.textAlign = 'center';
                  this.ctx.shadowColor = 'rgba(0, 0, 0, 0.3)';
                  this.ctx.shadowBlur = 4;
                  this.ctx.fillText(animation.text, animation.x, animation.y);
              }
          } else {
              // 绘制星星粒子
              this.ctx.fillStyle = '#FFD700';
              this.ctx.beginPath();
              this.ctx.arc(animation.x, animation.y, animation.size, 0, Math.PI * 2);
              this.ctx.fill();
          }

          this.ctx.restore();
          return true;
      }
      return false;
  });
}
    /**
     * 保存最高分
     */
    saveHighScore() {
        localStorage.setItem('snakeHighScore', this.highScore.toString());
    }

    /**
     * 重置分数
     */
    reset() {
        this.score = 0;
        this.animations = [];
    }
}